<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        
        <script>
            function test1(){
                //debugger
                json1 = {"code": "12345", "name":"zhang san","age":15}; //代码中字面表示, JSON标准表示法
                console.log("json1",json1);
                 let view1 = document.getElementById("view1");
                 //JSON 转字符串:
                 view1.value = 'json1:'+JSON.stringify(json1);
                json2 = {'code': '12345', 'name':'zhang san','age':15}; //代码中字面表示, javascript兼容表示法
                console.log('json2',json2);
                json3 = {code: '12345', name:'zhang san',age:15}; //代码中字面表示, javascript兼容表示法
                console.log('json3',json3);
                
                 //JSON 转字符串:
                let str2 = 'json2:'+JSON.stringify(json2);
                view1.value += '\n' + str2;
                let str3 = "json3:"+JSON.stringify(json3);
                view1.value += '\n' + str3;
                
                //访问JSON中的键值：
                //直接用 json.keyname
                let code1 = json1.code;
                //使用中括号（['keyname']）来访问对象的键值：
                let code2 = json1['code'];
                console.log('code1:',code1);
                console.log('code2:',code2);
                
                //字符串转JSON对象
                let str4 = '{"code":"12345","name":"zhang san","age":15}'; //单引号作为外层引号
                let json4= JSON.parse(str4);
                console.log('json4:',json4);
                /*
                let str5 = "{'code':'12345','name':'zhang san','age':15}"; //双引号作为外层引号
                console.log('str5',str5);
                let json5= JSON.parse(str5);  //出错
                console.log('json5:',json5);
                */
                let str6 = "{\"code\":\"12345\",\"name\":\"zhang san\",\"age\":15}"; //双引号作为外层引号,内含双引号作为字符内容
                //在字符串中用转义\"，就表示里面有个"不是边界符
                
                console.log('str6:',str6);
                let json6= JSON.parse(str6);  //OK
                console.log('json6:',json6);
                
                
            }
            
             function test2(){
                 let view1 = document.getElementById("view1");
                 view1.value = "";
             }   
                      
        </script>
        
    </head>
    <body>
        
		<div id="main1">
            <span>JSON示例</span><br/>
			<div id="top1">
				<button onclick="test1()">测试一</button>
				<button onclick="test2()">清除</button>
			</div>
				结果显示区1<br/>
			<textarea id="view1" cols="80" rows="24"></textarea>
		</div>
        
    </body>
</html>
